import { NSplit, type SplitProps } from "naive-ui";
import type { HTMLAttributes } from "vue";
import { getSlotsDom } from "../utils";
import type { BaseComponentType } from "../types";

export type SplitFactoryConstructorType = {
  props?: SplitProps;
  attrs?: HTMLAttributes;
  resizeTriggerSlot?: BaseComponentType;
  oneSlot?: BaseComponentType;
  TwoSlot?: BaseComponentType;
};

export class SplitFactory {
  private props: SplitProps = {};
  private attrs: HTMLAttributes = {};
  private resizeTriggerSlot: BaseComponentType = null;
  private oneSlot: BaseComponentType = null;
  private TwoSlot: BaseComponentType = null;

  constructor(data?: SplitFactoryConstructorType) {
    if (data?.props) this.setProps(data.props);
    if (data?.attrs) this.setAttrs(data.attrs);
    if (data?.resizeTriggerSlot) this.setResizeTrigger(data.resizeTriggerSlot);
    if (data?.oneSlot) this.setOne(data.oneSlot);
    if (data?.TwoSlot) this.setTwo(data.TwoSlot);
  }

  setAttrs(attrs: HTMLAttributes) {
    this.attrs = attrs;
    return this;
  }
  setProps(props: SplitProps) {
    this.props = props;
    return this;
  }

  setResizeTrigger(resizeTriggerSlot: BaseComponentType) {
    this.resizeTriggerSlot = resizeTriggerSlot;
    return this;
  }

  setOne(oneSlot: BaseComponentType) {
    this.oneSlot = oneSlot;
    return this;
  }

  setTwo(TwoSlot: BaseComponentType) {
    this.TwoSlot = TwoSlot;
    return this;
  }

  create() {
    return (
      <NSplit {...this.attrs} {...this.props}>
        {{
          "resize-trigger":
            this.resizeTriggerSlot != null
              ? () => getSlotsDom(this.resizeTriggerSlot)
              : null,
          1: this.oneSlot != null ? () => getSlotsDom(this.oneSlot) : null,
          2: this.TwoSlot != null ? () => getSlotsDom(this.TwoSlot) : null,
        }}
      </NSplit>
    );
  }
}
